
.banner{
        width: 1230px;
        height: 460px;
        margin: 0px auto;
        position: relative;
    }
    .img-list li{
        position: absolute;
        top: 0;
        left: 0;
        display: none;
    }
    .img-list li.current{
        display: block;
    }
    .indicator{
        width: 200px;
        position: absolute;
        right: 30px;
        bottom: 20px;
        bottom: 20px;
        display: flex;
        justify-content: center;
        color: white;
    }
    .indicator li{
        width: 10px;
        height: 10px;
        background-color: #aaa;
        text-align: center;
        line-height: 10px;
        margin: 0 5px;
        border-radius: 50%;
        cursor: pointer;
    }
    .indicator li.active{
        background-color: red;
    }
    .img-click span{
        width: 60px;
        height: 80px;
        line-height: 80px;
        text-align: center;
        color: white;
        background-color: rgba(0, 0, 0, 0.1);
        position: absolute;
        top: calc(50% - 40px);
        display: none;
    }
    .img-click span i{
        font-size: 26px;
    }
    .img-click span:hover{
        background-color: orange;
        cursor: pointer;
    }
    .img-click .prev{
        left: 240px;
    }
    .img-click .next{
        right: 5px;
    }
    .box-nav{
        width: 235px;
        height: 460px;
        position: absolute;
        background-color: rgba(0, 0, 0, 0.5);
    }
    .box-nav>ul{
        width: 235px;
        height: 40px;
        font-size: 14px;
        line-height: 40px;
        color: white;
        cursor: pointer;
        justify-content: space-between;
    }
    .box-nav>ul>li{
        padding: 0 30px;
    }
    .box-nav>ul>li:nth-child(2){
        color: #dcdcdc;
        font-size: 14px;
    }
    .box-nav>ul:hover{
        background-color: orangered;
    } 
    .nav-message{
        width: 990px;
        height: 458px;
        float: left;
        top: 2px;
        left: 235px;
        box-shadow:  0 0 2px #b0b0b0;
        position: absolute;
        display: none;
    }
    .nav-message>div{
        width: 247px;
        height: 456px;
        background-color: white;
        float: left;
    }
    .nav-message>div>div{
        width: 245px;
        height: 40px;
        position: relative;
        top: 17px;
        margin-bottom: 35px;
    }
    .nav-message>div>div>img{
        width: 40px;
        height: 40px;
        position: relative;
        left: 20px;
    } 
    .nav-message>div>div>span{
        margin-left: 15px;
        position: relative;
        top: -16px;
        left: 10px;
        line-height: 25px;
        color: black;
        color: #333;
        cursor: pointer;
    }
    .nav-message>div>div>span:nth-child(3){
        border: 1px solid orangered;
        position: absolute;
        padding: 0px 15px;
        left: 150px;
        top: 5px;
        text-align: center;
    } 
    .nav-message>div>div>span:nth-child(2):hover{
        color: orangered;
    }
    .nav-message>div>div>span:nth-child(3):hover{
        color: white;
        background-color: orangered;
    }



    .box-type{
        width: 1230px;
        height: 200px;
        display: flex;
        margin-bottom: 25px;
    }
    .choice{
        width: 235px;
        height: 170px;
        position: relative;
        display: flex;
        flex-wrap: wrap;
        top: 15px;
        background-color: #5f5750;
        cursor: pointer;
    }
    .box-type div{
        width: 315px;
        height: 170px;
        margin-top: 15px;
        margin-left: 15px;
        cursor: pointer;
    }
    .box-type div img{
        width: 315px;
        height: 170px;
    }
    .box-type div:hover{
        box-shadow: 15px 0 15px rgba(0, 0, 0, 0.4);
    }
    .choice>span{
        position: absolute;
        background-color: rgba(160, 160, 160, 0.2);
    }
    .span1{
        width: 220px;
        height: 1px;
        top: 85px;
        left: 6px;
    }
    .span2{
        width: 1px;
        height: 160px;
        top: 5px;
        left: 78px;
    }
    .span3{
        width: 1px;
        height: 160px;
        top: 5px;
        left: 157px;
    }
    .choice .span4{
        width: 16px;
        height: 16px;
        top: 77px;
        left: 70px;
        border-radius: 50%;
        z-index: 999;
        background-color: #5f5750; 
    }
    .choice .span5{
        width: 16px;
        height: 16px;
        top: 77px;
        left: 149px;
        border-radius: 50%;
        z-index: 999;
        background-color: #5f5750; 
    }
    .choice li{
        width: 78px;
        height: 85px;
        line-height: 85px;
        text-align: center;
        color: #b0b0b0;
        position: relative;
    }
    .choice li:hover{
        color: #fff;
    }
    .choice>li>span{
        margin: 0;
        padding: 0;
        position: absolute;
        top: 20px;
        left: 13px;
        font-size: 14px;
    }
    .choice li i{
        font-size: 35px;
    }

